<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>吉林省幻城科技有限公司</title>
    <link rel="icon" href="images/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="css/public.css">
    <link rel="stylesheet" href="css/index.css">
    <script src="js/jquery.min.js"></script>
</head>
<body>
<!-- 导航栏 -->
<div class="nav">
    <div class="nav_con">
        <img class="logo" src="images/logo.png" width="10%"/>
        <img class="logo_infro" src="images/logo_infro.png" width="15%"/>
        <ul class="nav_ul">
            <li class="nav_li"><a href="index.html" class="active_hover" title="从这里开始">首页</a>
                <div></div>
            </li>
            <li class="nav_li"><a href="about.html" title="公司简介">关于幻城</a>
                <div></div>
            </li>
            <li class="nav_li"><a href="game.html" title="精品专区">幻城游戏</a>
                <div></div>
            </li>
            <li class="nav_li"><a href="join.html" title="招贤纳士">加入幻城</a>
                <div></div>
            </li>
            <li class="nav_li"><a href="contact.html" title="保持联系">联系我们</a>
                <div></div>
            </li>
        </ul>
    </div>
</div>
<div class="kongbai"></div>
<!-- 导航栏结束 -->

<!-- 首页轮播 -->
<div class="lunbanner">
    <a class="lunbo_a">
        <div class="lunbo">
        </div>
    </a>
    <div class="lun_list">
        <ul>
            <li class="foucus_list"></li>
            <li></li>
            <li></li>
            <li></li>
        </ul>
    </div>
</div>
<script>
    $(function () {
        function play() {
            this.a = -1;
            this.url = ["banner1.jpg", "banner2.jpg", "banner3.jpg", "banner4.jpg"];
            this.aurl = ["#", "game.html", "game.html", "join.html"];
        };
        play.prototype = {
            Lun: function () {
                $(".lunbanner .lunbo_a").attr("href", Play.aurl[Play.a]);
                $(".lunbanner .lunbo").css({"background": "url(images/" + Play.url[Play.a] + ") no-repeat center"}, "backgroundSize", "auto 100%");
                if (Play.a > 2) {
                    Play.a = -1;
                }
                Play.a++;
                $(".lun_list ul li").removeClass("foucus_list");
                $(".lun_list ul li").eq(Play.a - 1).addClass("foucus_list");

                // console.log(Play.a);
            },
            Inval: function () {
                setInterval(Play.Lun(), 2000);
            },
            Click: function () {
                $(".lun_list ul li").click(function () {
                    console.log($(this).index());
                    $(".lun_list ul li").removeClass("foucus_list");
                    $(".lun_list ul li").eq($(this).index()).addClass("foucus_list");
                    Play.a = $(this).index();
                    $(".lunbo").css({"background": "url(images/" + Play.url[Play.a] + ") no-repeat center"}, "backgroundSize", "100%");
                    $(".lunbanner .lunbo_a").attr("href", Play.aurl[Play.a]);

                });
            },
            NavHover: function () {
                $(".nav_li").hover(function () {
                    $(this).find('div').stop().animate({"width": "100%"}, 300);
                }, function () {
                    $(this).find('div').stop().animate({"width": "0px"}, 200);
                });
            },
            Video: function (a, b) {
                $(a).click(function () {
                    console.log($(this).find("video"));
                    $(b).fadeIn();
                    $(this).parent().parent().find("video")[0].play();
                });
            }
        }
        var Play = new play()
        Play.Lun();
        Play.Inval();
        setInterval(Play.Inval, 5000);
        Play.Click();
        Play.NavHover();
        Play.Video(".video_play2", ".play_video2");
        Play.Video(".video_play", ".play_video");
    })
</script>
<!-- 首页轮播结束 -->

<!-- 热门游戏 -->
<div class="recommend">
    <div class="r_title">热门游戏</div>
    <div class="r_infro">POPULAR GAME</div>
    <div class="r_pic">
        <div class="hulun_pic">
            <div class="r_c_cover">
                <div class="r_c_c_title_one">呼伦贝尔麻将<br/>博乐热门游戏</div>
                <span class="r_c_line_one"></span>
                <div class="r_c_c_font_one">天苍苍，野茫茫，有风圈，超级杠！</div>
                <div class="r_c_c_btn_one"><a href="game.html" target="_blank"><img
                        src="images/right.png"/></a></div>
            </div>
        </div>
        <div class="tiandkeng_pic">
            <div class="r_c_cover">
                <div class="r_c_c_title">博乐填大坑<br/>博乐热门游戏</div>
                <span class="r_c_line"></span>
                <div class="r_c_c_font">几杯小酒下肚，踢起坑来不憷！</div>
                <div class="r_c_c_btn"><a href="game.html" target="_blank"><img
                        src="images/right.png"/></a></div>
            </div>
        </div>
        <div class="changchun_pic">
            <div class="r_c_cover">
                <div class="r_c_c_title">长春麻将<br/>博乐热门游戏</div>
                <span class="r_c_line"></span>
                <div class="r_c_c_font">小烧烤，辣火锅，不是冲宝就是自摸！</div>
                <div class="r_c_c_btn"><a href="game.html" target="_blank"><img
                        src="images/right.png"/></a></div>
            </div>
        </div>
        <div class="xinganmeng_pic">
            <div class="r_c_cover">
                <div class="r_c_c_title">兴安盟麻将<br/>博乐热门游戏</div>
                <span class="r_c_line"></span>
                <div class="r_c_c_font">七小对，一条龙，飘胡晾喜兴安盟！</div>
                <div class="r_c_c_btn"><a href="game.html" target="_blank"><img
                        src="images/right.png"/></a></div>
            </div>
        </div>
        <div class="doudizhu_pic">
            <div class="r_c_cover">
                <div class="r_c_c_title">博乐斗地主<br/>博乐热门游戏</div>
                <span class="r_c_line"></span>
                <div class="r_c_c_font">王炸在手，天下我有！来玩啊，大爷！</div>
                <div class="r_c_c_btn"><a href="game.html" target="_blank"><img
                        src="images/right.png"/></a></div>
            </div>
        </div>
    </div>
</div>
<!-- 热门游戏结束 -->

<!-- 首页底部轮播图 -->
<div id="lun_nav">
    <ul>
        <li><img src="./images/lunnav-1.jpg"/></li>
        <li><img src="./images/lunnav-2.jpg"/></li>
        <li><img src="./images/lunnav-3.jpg"/></li>
        <li><img src="./images/lunnav-4.jpg"/></li>
    </ul>
</div>
<!-- 底部轮播控件 -->
<script>
    window.onload = function () {
        var odiv = document.getElementById('lun_nav');
        var oul = odiv.getElementsByTagName('ul')[0];
        var ali = oul.getElementsByTagName('li');
        var spa = -2;
        oul.innerHTML = oul.innerHTML + oul.innerHTML;
        oul.style.width = ali[0].offsetWidth * ali.length + 'px';

        function move() {
            if (oul.offsetLeft < -oul.offsetWidth / 2) {
                oul.style.left = '0';
            }
            if (oul.offsetLeft > 0) {
                oul.style.left = -oul.offsetWidth / 2 + 'px'
            }
            oul.style.left = oul.offsetLeft + spa + 'px';
        }

        var timer = setInterval(move, 30)

        odiv.onmousemove = function () {
            clearInterval(timer);
        }
        odiv.onmouseout = function () {
            timer = setInterval(move, 30)
        };
    }
</script>
<!-- 首页底部轮播图 end -->

<!-- 右侧漂浮 -->
<div class="rightfix">
    <dl>
        <dd>
            <a class="kefu"></a>
        </dd>
        <dd>
            <a class="back_top"></a>
        </dd>
    </dl>
</div>
<script>
    $(".back_top").hide();
    $(function () {
        $(window).scroll(function () {
            if ($(window).scrollTop() > 100) {
                $(".back_top").fadeIn(200);
            }
            else {
                $(".back_top").fadeOut(200);
            }
        });

        $(".back_top").click(function () {
            $('body,html').animate({scrollTop: 0}, 500);
            return false;
        });
    });
</script>
<!-- 遮罩层 -->
<div id="goodcover"></div>
<!-- 弹出框 -->
<div id="code">
    <div class="header">
        <div class="close1" style="margin: 10px 10px 0 0;"><a href="javascript:void(0)" id="closebt"><img src="images/close.png"></a></div>
    </div>
    <div class="header1">
        <div class="goodtxt">
            <p>微信扫一扫</p>
            <p>添加博乐官方微信</p>
            <p>了解更多游戏相关</p>
        </div>
        <div class="code-img"> <img id="ewmsrc"  src="images/code.jpg"/></div>
    </div>
    <div class="header2">
        <div class="goodtxt">
            <p>微信扫一扫</p>
            <p>添加博乐官方微信客服</p>
            <p>了解更多游戏相关~</p>
        </div>
        <div class="code-img"> <img id="ewmsrc1"  src="images/code.jpg"/></div>
    </div>
</div>
<script>
    $(function () {
        //alert($(window).height());
        $('.kefu').click(function () {
            $('#code').center();
            $('#goodcover').show();
            $('#code').fadeIn();
        });
        $('#closebt').click(function () {
            $('#code').hide();
            $('#goodcover').hide();
        });
        $('#goodcover').click(function () {
            $('#code').hide();
            $('#goodcover').hide();
        })
        jQuery.fn.center = function (loaded) {
            var obj = this;
            body_width = parseInt($(window).width());
            body_height = parseInt($(window).height());
            block_width = parseInt(obj.width());
            block_height = parseInt(obj.height());

            left_position = parseInt((body_width / 2) - (block_width / 2) + $(window).scrollLeft());
            if (body_width < block_width) {
                left_position = 0 + $(window).scrollLeft();
            }
            ;

            top_position = parseInt((body_height / 2) - (block_height / 2) + $(window).scrollTop());
            if (body_height < block_height) {
                top_position = 0 + $(window).scrollTop();
            }
            ;

            if (!loaded) {

                obj.css({
                    'position': 'absolute'
                });
                obj.css({
                    'top': ($(window).height() - $('#code').height()) * 0.5,
                    'left': left_position
                });
                $(window).bind('resize', function () {
                    obj.center(!loaded);
                });
                $(window).bind('scroll', function () {
                    obj.center(!loaded);
                });

            } else {
                obj.stop();
                obj.css({
                    'position': 'absolute'
                });
                obj.animate({
                    'top': top_position
                }, 200, 'linear');
            }
        }

    })
</script>
<!-- 右侧漂浮 end -->

<!-- 联系我们 -->
<div class="contact_us">
    <div class="contact_con">
        <div class="con_list c_c_one">
            <div class="con_list_title">联系我们</div>
            <div class="c_l_wx">
                <img src="images/wx.png"/>
                <div class="wx_font">关注官方微信<br>获得更多资讯</div>
                <img class="wx_img" src="images/ewm1.jpg"/>
            </div>
            <div class="c_l_wx c_l_wb">
                <img src="images/wx.png"/>
                <div class="wx_font">关注官方客服<br>获得更多资讯</div>
                <img class="wx_img2" src="images/ewm2.jpg">
            </div>
        </div>
        <div class="con_list c_c_two">
            <div class="c_c_t_con">
                <img src="images/mail.png"/>
                <div class="c_mail">E-mail：advice@yeahworld.com</div>
            </div>
            <div class="c_c_t_con c_c_address">
                <img src="images/address.png"/>
                <div class="c_mail">地址：吉林省长春市人民大街7088号伟峰国际702室</div>
            </div>
        </div>
    </div>
</div>
<!-- 联系我们结束 -->

<!-- 页脚 -->
<div class="footer">
    <div class="footer_con">
        <div class="foote_logo">
            <img src="images/logo.png"/>
        </div>
        <div class="footer_font">
            <ul>
                <li><a href="about.html" target="_blank">关于幻城 </a><span class="np">|</span> <a href=""
                                                                                                target="_blank"></a>服务协议<span
                        class="np">|</span> <a href="join.html" target="_blank">加入我们</a><span class="np">|</span> <a
                        href="contact.html" target="_blank">联系我们</a></li>
                <li>吉林幻城科技有限公司 版权所有 吉网文 【2017】 1133-004号 吉ICP备17000914号-1</li>
                <li>ICP：吉B2-20170047</li>
            </ul>
        </div>
    </div>
</div>
<!-- 页脚结束 -->

<!-- 满屏蒲公英动效 -->
<div class="snow-container" style="position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:10000;"></div>
<script src="js/jquery-pugongying.min.js"></script>
<script type="text/javascript" src="all.js"></script>
<!-- 满屏蒲公英动效 end -->
</body>
</html>
